
.bg{
  position: fixed;top: 0;bottom: 0;left: 0;right: 0;background-color: rgba(55,55,55,.6);height: 100%;z-index: 1000;
  display: flex;
  align-items: center;
  justify-content: center;
}
.kuang{
  width:800px;height: 500px;background: #fff;margin:0 auto;border-top:3px #007dfe solid;
  .title{
    width:100%;line-height: 50px;height:50px;border-bottom:1px #ccc solid;
    span{
      font-size: 20px;font-weight: bold;float: left;padding-left:20px;
    }
    .close{
      float: right;padding:20px;color: #ccc;cursor: pointer;
    }
  }
  .inner{
    height:calc(100% - 50px);color: #666;font-size: 13px;
    .left{
        background: #c8dcf0;float: left;width:200px;height: 100%;
      a{
        line-height: 30px;height: 36px;display: block;color: #666;width: 100%;text-align: left;padding:3px 10px;border-left:3px #c8dcf0 solid;
      }
      a.cur{
        background: #fff;color: #007dfe;border-left:3px #007dfe solid;
      }
    }
    .right{
      float: right;width:600px;padding:20px;
      .topTwo{
        a{
          line-height: 30px;height: 30px;display: block;color: #666;text-align: left;width:33%;float: left;
        }
        a.cur{
          color: #007dfe;
        }
      }
      .topThree{
        border-top:1px #eee solid;margin-top:20px;padding-top:20px;overflow: auto;max-height: 270px;
        span{
          display: inline-block;
          margin: 4px 10px 4px 0;
          padding: 0 8px;
          border-radius: 3px;
          font-size: 12px;
          vertical-align: middle;
          opacity: 1;
          overflow: hidden;
          cursor: pointer;
          height: 24px;
          line-height: 24px;
          border: 1px solid #e9eaec;
          color: #495060;
          background: #fff!important;
          position: relative;
        }
      }
    }
  }
}
